<template>
  <div style="display:inline-block;margin-left:10px" v-if="showButtin">
    <template v-if="row.status === 3">
      <el-button type="primary" size="mini" @click="handleConfirm">
        确认收货
      </el-button>
    </template>
    <template v-else-if="row.status === 2">
      <el-button type="primary" size="mini" @click="sendOrder">
        确认发货
      </el-button>
    </template>
    <el-dialog title="确认发货" :visible.sync="dialogFormVisible" width="480px">
      <el-card shadow="hover">
        <div slot="header" style="text-align:left">
          <span>发货物流</span>
        </div>
        <el-form :model="createLogicInfo" ref="createLogicInfoForm" :rules="createLogicInfoRules" label-position="right"
          label-width="100px">
          <el-form-item label="物流方式：" prop="logicType">
            <el-select v-model="createLogicInfo.logicType">
              <el-option v-for="item in logicTypeJson" :key="item.value" :label="item.label" :value="item.value" />
            </el-select>
          </el-form-item>
          <el-form-item label="物流信息：" prop="logicRemark">
            <template v-if="createLogicInfo.logicType === 1">
              <el-select v-model="createLogicInfo.logicRemark">
                <el-option v-for="item in driverList" :key="item.value"
                  :label="item.carNo+'-'+item.name+'-'+item.mobile" :value="item.carNo+'-'+item.name+'-'+item.mobile" />
              </el-select>
            </template>
            <template v-else>
              <el-input v-model="createLogicInfo.logicRemark" placeholder="请输入" :autosize="{ minRows: 2, maxRows: 4}"
                type="textarea" />
            </template>
          </el-form-item>
        </el-form>
      </el-card>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取消</el-button>
        <el-button type="primary" @click="handleSend()">确定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { orderSend, orderConfirm } from '@/api/mall'
import { logicTypeJson } from '../constant'
export default {
  name: 'ConfirmButton',
  props: {
    row: {
      type: Object,
      default: () => ({})
    },
    userInfo: {
      type: Object,
      default: () => ({})
    },
    orderStatusJson: {
      type: Array,
      default: () => []
    },
    orderTypeJson: {
      type: Array,
      default: () => []
    },
    driverList: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      showButtin: false,
      dialogFormVisible: false,
      createLogicInfo: {
        logicType: 1,
        logicRemark: ''
      },
      createLogicInfoRules: {
        logicType: [{ required: true, message: '请输入', trigger: 'blur' }],
        logicRemark: [{ required: true, message: '不能为空', trigger: 'blur' }],
      },
      logicTypeJson,
    }
  },
  watch: {
    row(val) {
      this.$nextTick(() => {
        this.isShow()
      })
    },
    userInfo(val) {
      this.$nextTick(() => {
        this.isShow()
      })
    },
    'createLogicInfo.logicType': function () {
      this.createLogicInfo.logicRemark = ''
    },
  },
  created() {
    this.$nextTick(() => {
      this.isShow()
    })
  },
  methods: {
    isShow() {
      //类型
      if (this.row.type !== 3) {
        this.showButtin = false
        return false
      }
      //状态&用户类型
      // if (!(this.userInfo.type === 2 && this.row.status === 2) && !(this.userInfo.type === 1 && this.row.status === 3)) {
      //   this.showButtin = false
      //   return false
      // }
      //去除用户类型判断
      if (!(this.row.status === 2 && this.checkButtonPermission('send')) && !(this.row.status === 3 && this.checkButtonPermission('receivce'))) {
        this.showButtin = false
        return false
      }
      this.showButtin = true
    },
    handleSend() {
      this.$refs["createLogicInfoForm"].validate((valid) => {
        if (valid) {
          const params = {
            logicType: this.createLogicInfo.logicType,
            logicRemark: this.createLogicInfo.logicRemark,
            originalId: this.row.id
          }
          orderSend(params).then(() => {
            this.$emit('getList')
            this.dialogFormVisible = false;
            // this.$notify({
            //   title: "成功",
            //   message: "操作成功",
            //   type: "success",
            //   duration: 2000,
            // });

            this.$message({
              message: '操作成功',
              type: 'success'
            });
          });
        }
      });
    },
    sendOrder() {
      this.dialogFormVisible = true;
      this.createLogicInfo.logicType = 1
      this.createLogicInfo.logicRemark = ''
      this.$nextTick(() => {
        this.$refs['createLogicInfoForm'].clearValidate()
      })
    },
    handleConfirm() {
      this.$confirm("因确认收货后将不能再退货处理，为保障您的售后利益，请在收到货物后检验是否符合要求再按立即收货，请确认否立即收货？").then(() => {
        orderConfirm({ originalId: this.row.id }).then(() => {
          this.$emit('getList')
          // this.$notify({
          //   title: "成功",
          //   message: "操作成功",
          //   type: "success",
          //   duration: 2000,
          // });

          this.$message({
            message: '操作成功',
            type: 'success'
          });
        });
      });
    },
  }
}
</script>
